<template>
  <div class="demo-block">
    <h4>弹出位置</h4>
    <div class="demo-row">
      <my-button type="primary" @click="toast({title:'上方提示',position:'top'})">上方提示</my-button>
      <my-button type="primary" @click="toast({title:'中间提示',position:'center'})">中间提示</my-button>
      <my-button type="primary" @click="toast({title:'下方提示',position:'bottom'})">下方提示</my-button>
    </div>
  </div>
</template>

<script>
import button from "../../../../src/components/button";
import toast from "../../../../src/components/toast";
export default {
  components: {
    "my-button": button,
  },
  data() {
    return {
      toast,
    };
  },
};
</script>

<style scoped>
.demo-row {
  margin: -10px;
}
</style>
